<template>
  <div>
    <!-- table -->
    <BreakSpace label="归档信息" :containerStyle="{ marginBottom: '10px' }" />
    <FormPanel ref="formPanel1" :list="formList" :cols="4" :formType="'add'" labelWidth="110" :isSubmitBtn="false" @formChange="formChangeHandle" />

    <BreakSpace label="故障码列表" :containerStyle="{ marginBottom: '10px' }" />
    <FilterTable
      ref="table"
      :columns="columns"
      :params="fetchParams"
      :dataSource="dataList"
      :datakey="'items'"
      :onColumnsChange="columns => (this.columns = columns)"
      :onRowSelectChange="selectChange"
      selectionType="single"
    >
    </FilterTable>
    <div style="margin-bottom: 1rem;"></div>
    <BreakSpace label="主损配件列表" :containerStyle="{ marginBottom: '10px' }" />
    <FilterTable
      ref="table"
      :columns="columns1"
      :params="fetchParams"
      :dataSource="dataList1"
      :datakey="'items'"
      :onColumnsChange="columns => (this.columns = columns)"
      :onRowSelectChange="selectChange"
      selectionType="single"
    >
    </FilterTable>
    <BreakSpace label="质量信息" :containerStyle="{ marginBottom: '10px' }" />
    <FormPanel ref="formPanel" :list="formList1" :cols="4" :formType="'add'" labelWidth="110" :isSubmitBtn="false" />
    <BreakSpace label="故障码列表" :containerStyle="{ marginBottom: '10px' }" />
    <FilterTable
      ref="table"
      :columns="guzhangmaliebiao"
      :params="fetchParams"
      :dataSource="huanxiajiandataList"
      :datakey="'items'"
      :onColumnsChange="columns => (this.columns = columns)"
      :onRowSelectChange="selectChange"
      selectionType="single"
    >
    </FilterTable>
    <BreakSpace label="配件列表" :containerStyle="{ marginBottom: '10px' }" />
    <FilterTable
      ref="table"
      :columns="columnspeijianliebiao"  columnsfujiaxiangmu
      :params="fetchParams"
      :dataSource="fujiaxiangmudataList"
      :datakey="'items'"
      :onColumnsChange="columns => (this.columns = columns)"
      :onRowSelectChange="selectChange"
      selectionType="single"
    >
    </FilterTable>

    <LazyLoadTab v-model="activeName" :tabMenus="menus"></LazyLoadTab>
    <div style="padding-top: 3rem;"></div>
    <div style="padding-top: 3rem;"></div>
    <div
      :style="{
        position: 'absolute',
        left: 0,
        bottom: 0,
        right: 0,
        zIndex: 9,
        borderTop: '1px solid #e9e9e9',
        padding: '10px 20px',
        background: '#fff',
        textAlign: 'right'
      }"
    >
      <!-- <multiuse-button @click="closeDialog">作废</multiuse-button>
      <multiuse-button type="primary" @click="saveDialog">保存</multiuse-button>
      <multiuse-button @click="closeDialog">提交</multiuse-button> -->
      <multiuse-button type="primary" :click="closeDialog.bind()">驳回</multiuse-button>
      <multiuse-button type="primary" :click="closeDialog.bind()">归档</multiuse-button>
      <multiuse-button type="primary" :click="closeDialog.bind()">挂起</multiuse-button>
      <multiuse-button type="primary" :click="closeDialog.bind()">关 闭</multiuse-button>
    </div>
  </div>
</template>
<script>
  // import res from '@/mock/tableData';

  export default {
    // mixins: [dictionary],
    data() {
      return {
        dataList: [],
        dataList1: [],
        huanxiajiandataList: [],
        fujiaxiangmudataList: [],
        visible: false,
        visibleDrawer: false,
        collapse: false,
        infoId: null,
        // topFilterInit: this.topFilterInitFun(),
        flterValue: {}, //参数
        columns: this.creatHeader(),
        columns1: this.creatHeader1(),
        guzhangmaliebiao: this.guzhangmaliebiao(),
        columnspeijianliebiao: this.columnspeijianliebiao(),
        // fetchApi: getUser,
        fetchParams: {}, //ipa 接口
        selectedRows: [], //选中经销商
        formList: this.createFormList(),
        formList1: this.createFormList1(),
        saveData: null,
        activeName: '审核记录',
        menus: [
          {
            title: '审核记录',
            path: 'claimDemage/demo/demo/history/index',
            params: {
              type: 1
            }
          },
          {
            title: '维修历史',
            path: 'claimDemage/demo/demo/history/index',
            disabled: false,
            params: {
              type: 2
            }
          },
          {
            title: '索赔历史',
            path: 'claimDemage/demo/demo/history/index',
            disabled: false,
            params: {
              type: 2
            }
          }
        ]
      };
    },
    created() {
      // this.dataList = [...res.data.items];
      this.dataList1 = [...res.data.items];
      this.huanxiajiandataList = [...res.data.items];
      this.fujiaxiangmudataList = [...res.data.items];
      console.log(this.dataList);
    },
    methods: {
      formChangeHandle(val) {
        console.log(val);
        this.saveData = val;
      },
      //搜索获取数据
      changeHandle(val) {
        this.fetchParams = val;
        console.log(val);
      },
      //选中
      selectChange(rows) {
        this.selectedRows = rows;
        console.log(this.selectedRows);
      },
      //保存
      saveDialog() {
        this.$refs.formPanel1.SUBMIT_FORM();
        if (this.saveData) {
          this.$emit('save', this.selectedRows);
        }
      },
      //取消操作
      closeDialog() {
        this.$emit('close', { visible: false, data: this.selectedRows, type: 'close' });
      },
      chooseOrderNo() {
        this.visible = true;
      },
      add() {},
      createFormList() {
        return [

          {

            type: 'INPUT',

            label: '案例编号',//没弹出来

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '案例主题',

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '车型名称',

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '故障等级',

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '案例创建日期',

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '故障现象代码',//没弹出来

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '故障现象描述',

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '故障次数',

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '系统代码',

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '系统名称',

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '子系统代码',

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '子系统名称',

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '现象代码',

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '现象描述',

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '*案例描述',

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '建议',

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '附件',

            fieldName: 'cid',

            placeholder: '所属分类',

            itemList: [{ text: '热点', value: '1' }, { text: '资讯', value: '2' }],

            rules: [{ required: true, message: '请选择所属分类', trigger: 'change' }],

            disabled: true // 禁用

          }

        ];

      },
      createFormList1() {
        return [
          { type: 'SELECT', label: '经销商代码', fieldName: 'authStatus', placeholder: '请选择', initialValue: '', itemList: [{ text: '保存', value: '1001' }] },
          {
            type: 'INPUT',
            label: '经销商名称',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '质量报告状态',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          { type: 'SELECT', label: '质量报告单号', fieldName: 'authStatus', placeholder: '请选择', initialValue: '', itemList: [{ text: '保存', value: '1001' }] },
          {
            type: 'INPUT',
            label: '维修工单号',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: 'VIN',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '生产日期',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '销售日期',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '行驶里程',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '车型名称',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '制单人',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '联系方式',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '主损件',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '主损件名称',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '索赔单号',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '故障码',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '故障现象代码',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '故障现象描述',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '系统代码',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '系统名称',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '子系统代码',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '子系统名称',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '现象代码',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '现象描述',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'TEXT_AREA',
            label: '故障描述',
            fieldName: 'hobby',
            placeholder: '故障现象',
            rules: [{ required: true, message: '请选择兴趣爱好', trigger: 'change' }],
            rows: 3,
            selfCols: 3 // 元素占据几行
          },
          {
            type: 'TEXT_AREA',
            label: '维修经过',
            fieldName: 'hobby',
            placeholder: '故障原因',
            rules: [{ required: true, message: '请选择兴趣爱好', trigger: 'change' }],
            rows: 3,
            selfCols: 3 // 元素占据几行
          },
          {
            type: 'TEXT_AREA',
            label: '维修结果',
            fieldName: 'hobby',
            placeholder: '维修方案',
            rules: [{ required: true, message: '请选择兴趣爱好', trigger: 'change' }],
            rows: 3,
            selfCols: 3 // 元素占据几行
          },
          {
            type: 'TEXT_AREA',
            label: '建议意见',
            fieldName: 'wayPicture',
            placeholder: '上传身份证...',
            rules: [{ required: true, message: '请上传身份证', trigger: 'change' }, { limit: 1, validator: this.validateFn, message: '请上传1张图片', trigger: 'change' }],
          },
          {
            type: 'TEXT_AREA',
            label: '使用环境',
            fieldName: 'wayPicture1',
            placeholder: '上传身份证...',
            rules: [{ required: true, message: '请上传身份证', trigger: 'change' }, { limit: 1, validator: this.validateFn, message: '请上传1张图片', trigger: 'change' }],
          },
          {
            type: 'TEXT_AREA',
            label: '附件',
            fieldName: 'wayPicture',
            placeholder: '上传身份证...',
            rules: [{ required: true, message: '请上传身份证', trigger: 'change' }, { limit: 1, validator: this.validateFn, message: '请上传1张图片', trigger: 'change' }],
          }
        ];
      },
      //table表头和数据源
      creatHeader() {
        return [
          {
            title: '序号',
            dataIndex: 'index',
            width: 80,
            sorter: true,
            render: props => {
              return <span>{props.row.index + 1}</span>;
            }
          },
          { title: '故障码', dataIndex: 'date1', sorter: true },
          { title: '故障码描述', dataIndex: 'date2', sorter: true }
        ];
      },
      //table表头和数据源
      creatHeader1() {
        return [
          {
            title: '序号',
            dataIndex: 'index',
            width: 80,
            sorter: true,
            render: props => {
              return <span>{props.row.index + 1}</span>;
            }
          },
          { title: '配件代码', dataIndex: 'date1', sorter: true },
          { title: '配件名称', dataIndex: 'date2', sorter: true }
        ];
      },
      //故障码
      guzhangmaliebiao() {
        return [
          {
            title: '序号',
            dataIndex: 'index',
            width: 80,
            sorter: true,
            render: props => {
              return <span>{props.row.index + 1}</span>;
            }
          },
          { title: '故障码', dataIndex: 'date1', sorter: true },
          { title: '故障码描述', dataIndex: 'date2', sorter: true }
        ];
      },
      //配件列表
      columnspeijianliebiao() {
        return [
          {
            title: '序号',
            dataIndex: 'index',
            width: 80,
            sorter: true,
            render: props => {
              return <span>{props.row.index + 1}</span>;
            }
          },

          { title: '配件代码', dataIndex: 'date1', sorter: true },
          { title: '配件名称', dataIndex: 'date2', sorter: true },
          { title: '单位', dataIndex: 'date3', sorter: true },
          { title: '数量', dataIndex: 'date4', sorter: true },
          { title: '返件类型', dataIndex: 'date4', sorter: true }
        ];
      },
      //费用信息
      feiyongformList() {
        return [
          {
            type: 'INPUT',
            label: '合计费用',
            fieldName: 'title',
            placeholder: '请输入标题名称...',
            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],
            readonly: true // 只读
          },
          {
            type: 'INPUT',
            label: '工时费用',
            fieldName: 'title',
            placeholder: '请输入标题名称...',
            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],
            readonly: true // 只读
          },
          {
            type: 'INPUT',
            label: '配件费用',
            fieldName: 'title',
            placeholder: '请输入标题名称...',
            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],
            readonly: true // 只读
          },
          {
            type: 'INPUT',
            label: '附加项目费用',
            fieldName: 'title',
            placeholder: '请输入标题名称...',
            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],
            readonly: true // 只读
          }
        ];
      }
    }
  };
</script>

<style lang="less" scoped></style>
<template>
  <div>
    <!-- table -->
    <BreakSpace label="归档信息" :containerStyle="{ marginBottom: '10px' }" />
    <FormPanel ref="formPanel1" :list="formList" :cols="4" :formType="'add'" labelWidth="110" :isSubmitBtn="false" @formChange="formChangeHandle" />

    <BreakSpace label="故障码列表" :containerStyle="{ marginBottom: '10px' }" />
    <FilterTable
      ref="table"
      :columns="columns"
      :params="fetchParams"
      :dataSource="dataList"
      :datakey="'items'"
      :onColumnsChange="columns => (this.columns = columns)"
      :onRowSelectChange="selectChange"
      selectionType="single"
    >
    </FilterTable>
    <div style="margin-bottom: 1rem;"></div>
    <BreakSpace label="主损配件列表" :containerStyle="{ marginBottom: '10px' }" />
    <FilterTable
      ref="table"
      :columns="columns1"
      :params="fetchParams"
      :dataSource="dataList1"
      :datakey="'items'"
      :onColumnsChange="columns => (this.columns = columns)"
      :onRowSelectChange="selectChange"
      selectionType="single"
    >
    </FilterTable>
    <BreakSpace label="质量信息" :containerStyle="{ marginBottom: '10px' }" />
    <FormPanel ref="formPanel" :list="formList1" :cols="4" :formType="'add'" labelWidth="110" :isSubmitBtn="false" />
    <BreakSpace label="故障码列表" :containerStyle="{ marginBottom: '10px' }" />
    <FilterTable
      ref="table"
      :columns="guzhangmaliebiao"
      :params="fetchParams"
      :dataSource="huanxiajiandataList"
      :datakey="'items'"
      :onColumnsChange="columns => (this.columns = columns)"
      :onRowSelectChange="selectChange"
      selectionType="single"
    >
    </FilterTable>
    <BreakSpace label="配件列表" :containerStyle="{ marginBottom: '10px' }" />
    <FilterTable
      ref="table"
      :columns="columnspeijianliebiao"  columnsfujiaxiangmu
      :params="fetchParams"
      :dataSource="fujiaxiangmudataList"
      :datakey="'items'"
      :onColumnsChange="columns => (this.columns = columns)"
      :onRowSelectChange="selectChange"
      selectionType="single"
    >
    </FilterTable>

    <LazyLoadTab v-model="activeName" :tabMenus="menus"></LazyLoadTab>
    <div style="padding-top: 3rem;"></div>
    <div style="padding-top: 3rem;"></div>
    <div
      :style="{
        position: 'absolute',
        left: 0,
        bottom: 0,
        right: 0,
        zIndex: 9,
        borderTop: '1px solid #e9e9e9',
        padding: '10px 20px',
        background: '#fff',
        textAlign: 'right'
      }"
    >
      <!-- <multiuse-button @click="closeDialog">作废</multiuse-button>
      <multiuse-button type="primary" @click="saveDialog">保存</multiuse-button>
      <multiuse-button @click="closeDialog">提交</multiuse-button> -->
      <multiuse-button type="primary" :click="closeDialog.bind()">驳回</multiuse-button>
      <multiuse-button type="primary" :click="closeDialog.bind()">归档</multiuse-button>
      <multiuse-button type="primary" :click="closeDialog.bind()">挂起</multiuse-button>
      <multiuse-button type="primary" @click="closeDialog">关 闭</multiuse-button>
    </div>
  </div>
</template>
<script>
  // import res from '@/mock/tableData';

  export default {
    // mixins: [dictionary],
    data() {
      return {
        dataList: [],
        dataList1: [],
        huanxiajiandataList: [],
        fujiaxiangmudataList: [],
        visible: false,
        visibleDrawer: false,
        collapse: false,
        infoId: null,
        // topFilterInit: this.topFilterInitFun(),
        flterValue: {}, //参数
        columns: this.creatHeader(),
        columns1: this.creatHeader1(),
        guzhangmaliebiao: this.guzhangmaliebiao(),
        columnspeijianliebiao: this.columnspeijianliebiao(),
        // fetchApi: getUser,
        fetchParams: {}, //ipa 接口
        selectedRows: [], //选中经销商
        formList: this.createFormList(),
        formList1: this.createFormList1(),
        saveData: null,
        activeName: '审核记录',
        menus: [
          {
            title: '审核记录',
            path: 'claimDemage/demo/demo/history/index',
            params: {
              type: 1
            }
          },
          {
            title: '维修历史',
            path: 'claimDemage/demo/demo/history/index',
            disabled: false,
            params: {
              type: 2
            }
          },
          {
            title: '索赔历史',
            path: 'claimDemage/demo/demo/history/index',
            disabled: false,
            params: {
              type: 2
            }
          }
        ]
      };
    },
    created() {
      // this.dataList = [...res.data.items];
      this.dataList1 = [...res.data.items];
      this.huanxiajiandataList = [...res.data.items];
      this.fujiaxiangmudataList = [...res.data.items];
      console.log(this.dataList);
    },
    methods: {
      formChangeHandle(val) {
        console.log(val);
        this.saveData = val;
      },
      //搜索获取数据
      changeHandle(val) {
        this.fetchParams = val;
        console.log(val);
      },
      //选中
      selectChange(rows) {
        this.selectedRows = rows;
        console.log(this.selectedRows);
      },
      //保存
      saveDialog() {
        this.$refs.formPanel1.SUBMIT_FORM();
        if (this.saveData) {
          this.$emit('save', this.selectedRows);
        }
      },
      //取消操作
      closeDialog() {
        this.$emit('close', { visible: false, data: this.selectedRows, type: 'close' });
      },
      chooseOrderNo() {
        this.visible = true;
      },
      add() {},
      createFormList() {
        return [

          {

            type: 'INPUT',

            label: '案例编号',//没弹出来

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '案例主题',

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '车型名称',

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '故障等级',

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '案例创建日期',

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '故障现象代码',//没弹出来

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '故障现象描述',

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '故障次数',

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '系统代码',

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '系统名称',

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '子系统代码',

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '子系统名称',

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '现象代码',

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '现象描述',

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '*案例描述',

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '建议',

            fieldName: 'title',

            placeholder: '请输入标题名称...',

            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],

            readonly: true // 只读

          },

          {

            type: 'INPUT',

            label: '附件',

            fieldName: 'cid',

            placeholder: '所属分类',

            itemList: [{ text: '热点', value: '1' }, { text: '资讯', value: '2' }],

            rules: [{ required: true, message: '请选择所属分类', trigger: 'change' }],

            disabled: true // 禁用

          }

        ];

      },
      createFormList1() {
        return [
          { type: 'SELECT', label: '经销商代码', fieldName: 'authStatus', placeholder: '请选择', initialValue: '', itemList: [{ text: '保存', value: '1001' }] },
          {
            type: 'INPUT',
            label: '经销商名称',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '质量报告状态',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          { type: 'SELECT', label: '质量报告单号', fieldName: 'authStatus', placeholder: '请选择', initialValue: '', itemList: [{ text: '保存', value: '1001' }] },
          {
            type: 'INPUT',
            label: '维修工单号',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: 'VIN',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '生产日期',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '销售日期',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '行驶里程',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '车型名称',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '制单人',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '联系方式',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '主损件',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '主损件名称',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '索赔单号',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '故障码',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '故障现象代码',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '故障现象描述',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '系统代码',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '系统名称',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '子系统代码',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '子系统名称',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '现象代码',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'INPUT',
            label: '现象描述',
            fieldName: 'number',
            placeholder: '请输入数量...',
            initialValue: undefined,
            rules: [{ required: true, message: '请输入数量', trigger: 'blur' }]
          },
          {
            type: 'TEXT_AREA',
            label: '故障描述',
            fieldName: 'hobby',
            placeholder: '故障现象',
            rules: [{ required: true, message: '请选择兴趣爱好', trigger: 'change' }],
            rows: 3,
            selfCols: 3 // 元素占据几行
          },
          {
            type: 'TEXT_AREA',
            label: '维修经过',
            fieldName: 'hobby',
            placeholder: '故障原因',
            rules: [{ required: true, message: '请选择兴趣爱好', trigger: 'change' }],
            rows: 3,
            selfCols: 3 // 元素占据几行
          },
          {
            type: 'TEXT_AREA',
            label: '维修结果',
            fieldName: 'hobby',
            placeholder: '维修方案',
            rules: [{ required: true, message: '请选择兴趣爱好', trigger: 'change' }],
            rows: 3,
            selfCols: 3 // 元素占据几行
          },
          {
            type: 'TEXT_AREA',
            label: '建议意见',
            fieldName: 'wayPicture',
            placeholder: '上传身份证...',
            rules: [{ required: true, message: '请上传身份证', trigger: 'change' }, { limit: 1, validator: this.validateFn, message: '请上传1张图片', trigger: 'change' }],
          },
          {
            type: 'TEXT_AREA',
            label: '使用环境',
            fieldName: 'wayPicture1',
            placeholder: '上传身份证...',
            rules: [{ required: true, message: '请上传身份证', trigger: 'change' }, { limit: 1, validator: this.validateFn, message: '请上传1张图片', trigger: 'change' }],
          },
          {
            type: 'TEXT_AREA',
            label: '附件',
            fieldName: 'wayPicture',
            placeholder: '上传身份证...',
            rules: [{ required: true, message: '请上传身份证', trigger: 'change' }, { limit: 1, validator: this.validateFn, message: '请上传1张图片', trigger: 'change' }],
          }
        ];
      },
      //table表头和数据源
      creatHeader() {
        return [
          {
            title: '序号',
            dataIndex: 'index',
            width: 80,
            sorter: true,
            render: props => {
              return <span>{props.row.index + 1}</span>;
            }
          },
          { title: '故障码', dataIndex: 'date1', sorter: true },
          { title: '故障码描述', dataIndex: 'date2', sorter: true }
        ];
      },
      //table表头和数据源
      creatHeader1() {
        return [
          {
            title: '序号',
            dataIndex: 'index',
            width: 80,
            sorter: true,
            render: props => {
              return <span>{props.row.index + 1}</span>;
            }
          },
          { title: '配件代码', dataIndex: 'date1', sorter: true },
          { title: '配件名称', dataIndex: 'date2', sorter: true }
        ];
      },
      //故障码
      guzhangmaliebiao() {
        return [
          {
            title: '序号',
            dataIndex: 'index',
            width: 80,
            sorter: true,
            render: props => {
              return <span>{props.row.index + 1}</span>;
            }
          },
          { title: '故障码', dataIndex: 'date1', sorter: true },
          { title: '故障码描述', dataIndex: 'date2', sorter: true }
        ];
      },
      //配件列表
      columnspeijianliebiao() {
        return [
          {
            title: '序号',
            dataIndex: 'index',
            width: 80,
            sorter: true,
            render: props => {
              return <span>{props.row.index + 1}</span>;
            }
          },

          { title: '配件代码', dataIndex: 'date1', sorter: true },
          { title: '配件名称', dataIndex: 'date2', sorter: true },
          { title: '单位', dataIndex: 'date3', sorter: true },
          { title: '数量', dataIndex: 'date4', sorter: true },
          { title: '返件类型', dataIndex: 'date4', sorter: true }
        ];
      },
      //费用信息
      feiyongformList() {
        return [
          {
            type: 'INPUT',
            label: '合计费用',
            fieldName: 'title',
            placeholder: '请输入标题名称...',
            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],
            readonly: true // 只读
          },
          {
            type: 'INPUT',
            label: '工时费用',
            fieldName: 'title',
            placeholder: '请输入标题名称...',
            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],
            readonly: true // 只读
          },
          {
            type: 'INPUT',
            label: '配件费用',
            fieldName: 'title',
            placeholder: '请输入标题名称...',
            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],
            readonly: true // 只读
          },
          {
            type: 'INPUT',
            label: '附加项目费用',
            fieldName: 'title',
            placeholder: '请输入标题名称...',
            rules: [{ required: true, message: '请输入标题名称', trigger: 'blur' }, { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }],
            readonly: true // 只读
          }
        ];
      }
    }
  };
</script>

<style lang="less" scoped></style>
